<template>
	<view>
		<view style="height: 15px;"></view>
		<view  class="cardBox" style="margin-top: 0rpx;">
			
			<view class="flex" style="margin-top: 10rpx;">
				<view class="biao">
					<span class="biao_span">|</span> 
					<text style="font-size: 32rpx;">{{$t(Record.abnormal_issues)}} - {{$t(Record.abnormal_cause)}} </text> 
				</view>
				<view style="float: right;font-size: 18px;color: red;" v-if="Record.is_situation==0">
					{{$t("待处理")}}
				</view>
				<view style="float: right;font-size: 18px;color: red;" v-else-if="Record.is_situation==1 || Record.is_situation==2">
					{{$t("已处理")}}
				</view>
			</view>
			<view v-if="Record.abnormal_img&&Record.abnormal_img.length!=0" style="margin-top: 10rpx;padding-bottom: 20rpx;">
				<image :src="item.url" class="order_img" v-for="(item,index) in Record_img" :key="index" style="margin:0rpx 3%;margin-top: 20rpx;float: left;"></image>
				<view style="clear: both;"></view>
			</view>
			
			<view  style="margin-top: 10rpx;padding-bottom: 20rpx;">
				<block v-if="lang==='zh'">{{Record.situation_description||''}}</block>
				<block v-if="lang==='ru'">{{Record.situation_description_ru||''}}</block>
			</view>
			
			
			<view v-if="Record.edit_speed!=0"  style="margin-top: 10rpx;">
				<view class="biao">
					<span class="biao_span">|</span> 
					<text style="font-size: 32rpx;">{{$t('已申请调整时效')}} </text> 
				</view>
				<view style="margin-top: 10rpx;padding-bottom: 20rpx;">{{Record.edit_speed}} {{$t('天')}}</view>
			</view>
			
			<view  style="margin-top: 10rpx;padding-bottom: 20rpx;">
				<text style="font-weight: bold;font-size:32rpx;">{{text.submit_user}} </text>
				<view >
					
					<image :src="IMAGE_URL+do_user.avatar" class="close_image2"></image>
					<view style="line-height: 140rpx;float: left;">
						<block v-if="lang==='zh'">{{do_user.username}}</block>
						<block v-if="lang==='ru'">{{do_user.username_ru}}</block>
					</view>
					
					<view style="clear: both;"></view>
					
					<view class="flex" style="margin-top: 10rpx;padding-bottom: 20rpx;color: #999;">
						<view style="width: 50%;float: left; text-align: left;" >
							{{timestampToDate(Record.situation_time*1000)}}
						</view>
					</view>
					<view style="clear: both;"></view>
					
					
				</view>
			</view>
			
			
		</view>
	</view>
</template>

<script>
	import {
		ImageUrl,
		isVideo,
		time,createC2CConversation
	} from "@/common/public";
	import {HTTP_REQUEST_URL,HTTP_IMG_UTL,IMAGE_URL} from "@/config/app";
	
	export default {
		props:{
			order:{
				type:Object,
				default:{}
			},
			Record:{
				type:Object,
				default:{}
			},
			customStyle1:{
				type:Object,
				default:{}
			},
			customStyle11:{
				type:Object,
				default:{}
			},
			customStyle2:{
				type:Object,
				default:{}
			},
			customStyle3:{
				type:Object,
				default:{}
			},
		},
		data() {
			return {
				subDisabled:false,
				do_user:{},
				IMAGE_URL,
				Record_img:[],
				text:{
					title:'',
					submit_user:this.$t('提交人')
				},
				lang:this.$i18n.locale,
			}
		},
		mounted(){
			if(this.Record.user_id ==this.order.release_user.id){
				this.do_user = this.order.release_user
			}else{
				this.do_user = this.order.join_user
			}
			this.Record_img=this.Record.abnormal_img
			
		},
		methods:{
			timestampToDate(timestamp) {
			  const date = new Date(timestamp); // 如果timestamp是数值，可以直接作为Date构造函数的参数
			  const year = date.getFullYear();
			  const month = (date.getMonth() + 1).toString().padStart(2, '0');
			  const day = date.getDate().toString().padStart(2, '0');
			  const hours = date.getHours().toString().padStart(2, '0');
			  const minutes = date.getMinutes().toString().padStart(2, '0');
			  const seconds = date.getSeconds().toString().padStart(2, '0');
			  return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
			},
		}
	}
</script>

<style lang="css">
.cardBox {
	width: 94%;
	margin: 0 auto;
	margin-top: 30rpx;
	box-shadow: 0 0 10px #ddd;
	background: #ddd;
	padding: 10rpx 20rpx;
	border-radius: 20rpx;
	background: #fff;
	margin-bottom: 30rpx;
	position: relative;
}
.flex{width: 100%;display: flex;}
.biao{margin-top: 0rpx; width: 80%; margin-left: 0rpx;font-size: 30rpx;  font-weight: bold;}
.biao_span{color:darkorange ; font-size: 18px; margin-right: 5px;}
.cardTitle{font-size: 24rpx; width: 94%;padding-top: 6rpx;}
.order_img{width: 160rpx;height: 160rpx;border-radius: 20rpx;}
.close_image2{
	width: 120rpx;height: 120rpx;border-radius: 20rpx; margin-right: 20rpx; margin-top: 20rpx; float: left;
}
</style>